@import './base.css';

a,
.green {
  text-decoration: none;
  // color: hsla(160, 100%, 37%, 1);
  transition: 0.4s;
  color: #333;
}

// @media (hover: hover) {
//   a:hover {
//     opacity: 0.8;
//   }
// }

.scrollbar {
  &::-webkit-scrollbar {
    width: 1px; /* 滚动条宽度 */
  }

  &::-webkit-scrollbar-track {
    background: #D4AD8C; /* 轨道背景色 */
    border-radius: 3px;
    position: relative; /* 使 ::before 定位生效 */
  }

  &::-webkit-scrollbar-track::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 6px; /* 与滚动条宽度一致 */
    background: red; /* 红色顶部装饰 */
    border-radius: 3px 3px 0 0; /* 圆角处理 */
  }

  &::-webkit-scrollbar-thumb {
    background: #B52628; /* 滑块背景色 */
    border-radius: 3px;
  }

  &::-webkit-scrollbar-thumb:hover {
    background: #aaa; /* 鼠标悬停时滑块背景色 */
  }

  &::-webkit-scrollbar-thumb:active {
    background: #888; /* 滑块激活状态背景色 */
  }
}


.custom-prev,.custom-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.custom-prev:hover,.custom-next:hover {
  background-color: #fff;
  transform: translateY(-50%) scale(1.1);
}

.custom-prev {
  left: -25px;
  background: url('../assets/images/prev.png');
}

.custom-next {
  right: -25px;
  background: url('../assets/images/next.png');
}